<%--
  Created by IntelliJ IDEA.
  User: lenovo
  Date: 2021-11-27
  Time: 21:45
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta charset="utf-8">
    <title>注册</title>
    <link  href="${pageContext.request.contextPath}/css/css.css" rel="stylesheet" type="text/css">
    <link  href="${pageContext.request.contextPath}/css/sign.css" rel="stylesheet" type="text/css">
    <script src="${pageContext.request.contextPath}/js/jquery.js"></script>
    <script src="${pageContext.request.contextPath}/js/js.js"></script>
    <script src="${pageContext.request.contextPath}/js/sign.js"></script>
    <style>
        .submit{ margin-left:82px;}
    </style>
    <script>
        $(document).ready(function(e) {
            (function()
            {
                var fm_img=$('.up_fm .fm_img');
                var fm_del=$('.up_fm .fm_colse');
                var file=$('.up_img .up_img2');
                fm(file.eq(0),fm_img.eq(0),fm_del.eq(0));
            })();//设置头像

            /*$('.up_img2').change(function()
            {
               //console.dir($('.up_img2')[0].files)
                console.dir($('.up_text2')[0].files[0].name)  //上传的文件名称
            });//多个上传文件信息
            */
            (function()
            {
                var name=/^\s*[\w\.\@\u4e00-\u9fa5]{2,20}\s*$/;
                var email=/^\s*([a-zA-Z0-9][\w\.]{2,15})+@([a-zA-Z0-9]{2,5})+\.([a-zA-Z0-9]{2,5})\s*$/;
                var pwd=/^\s*[\w]{6,9}\s*$/;
                var ver=/^\s*[\w]{5,5}\s*$/;

                reg($('.text_1'),name);
                reg($('.text_2'),email);
                reg($('.text_3').eq(0),pwd);
                equal($('.text_3').eq(1),$('.text_3').eq(0))
                reg($('.style_none'),ver);

                $('.submit').click(function()
                {
                    if(!name.test($('.text_1').val()))
                    {
                        $('.text_1').siblings('.none').slideDown('slow');
                        $('.text_1').siblings('.none').find('i').css('color','red');
                        return false;
                    }
                    if(!email.test($('.text_2').val()))
                    {
                        $('.text_2').siblings('.none').slideDown('slow');
                        $('.text_2').siblings('.none').find('i').css('color','red');
                        return false;
                    }
                    if(!pwd.test($('.text_3').eq(0).val()))
                    {
                        $('.text_3').eq(0).siblings('.none').slideDown('slow');
                        $('.text_3').eq(0).siblings('.none').find('i').css('color','red');
                        return false;
                    }
                    if(!pwd.test($('.text_3').eq(1).val()))
                    {
                        $('.text_3').eq(1).siblings('.none').slideDown('slow');
                        $('.text_3').eq(1).siblings('.none').find('i').css('color','red');
                        return false;
                    }
                    if($('.text_3').eq(1).val()!==$('.text_3').eq(0).val())
                    {
                        $('.text_3').eq(1).siblings('.none').slideDown('slow');
                        $('.text_3').eq(1).siblings('.none').find('i').css('color','red');
                        return false;
                    }

                    if(!ver.test($('.style_none').val()))
                    {
                        $('.style_none').siblings('.none').slideDown('slow');
                        $('.style_none').siblings('.none').find('i').css('color','red');
                        return false;
                    }
                    /*

                    提交表单
                    */
                });

            })();
        });

    </script>
</head>

<body>
<header class="clear">
    <img src="../img/sss.png" >
    <div class="search left">
        <form  action="" method="get">
            <input type="text" value="" placeholder="请输入书名或作者名称">
            <input type="submit" value="搜索">
        </form>
        <p class="left">
            <span>热门推荐：</span>
            <a href="javascript:;">如何买到一本好书</a>
            <a href="javascript:;">三天学完java</a>
            <a href="javascript:;">五天入门</a>
            <a href="javascript:;">七天找到工作</a>
        </p>
    </div>
    <div class="reg">
        <!--<div class="delu">
            <a  href="javascript:;">登录</a>
            <span>|</span>
            <a  href="javascript:;">注册</a>
          </div>-->
        <div class="delu2 clear">
            <div class="self ease">
                <a href="javascript:;" class="clear">注册<span class="icon ease"></span></a>
                <div class="clear"></div>
                <ul  class="clear">
                    <li><a href="javascript:;">个人中心</a></li>
                    <li><a href="javascript:;">我的书架</a></li>
                    <li><a href="javascript:;">账号设置</a></li>
                    <li><a href="javascript:;">上传文件</a></li>
                    <li><a href="javascript:;">退出登录</a></li>
                </ul>
            </div>
            <span class="split">|</span>
            <a  href="javascript:;"  title="您有3条未读消息" class="news">消息<b>3</b></a>
        </div>
        <span>|</span>
        <a  href="javascript:;">意见反馈</a>
    </div>
</header>
<!--头部结束-->

<nav class="clear">
    <ul class="nav_1 clear">
        <div class="active"></div>
        <li><a href="../jsp/index.jsp">首页</a></li>
        <li><a href="../jsp/index_article.jsp">文学</a>
            <ul class="clear">
                <li><a href="javascript:;">现代文学</a></li>
                <li><a href="javascript:;">外国文学</a></li>
                <li><a href="javascript:;">古典文学</a></li>
                <li><a href="javascript:;">散文随笔</a></li>
            </ul>
        </li>
        <li><a href="javascript:;">社会学</a></li>
        <li><a href="javascript:;">心理学</a></li>
        <li><a href="javascript:;">经济学</a></li>
        <li><a href="javascript:;">自然科学</a></li>
        <li><a href="javascript:;">历史</a></li>
        <li><a href="javascript:;">其他</a>
            <ul class="clear">
                <li><a href="javascript:;">旅游攻略</a></li>
                <li><a href="javascript:;">周刊杂志</a></li>
                <li><a href="javascript:;">经典短语</a></li>
            </ul>
        </li>
        <div class="submission">
            <a href="javascript:;"><span class="icon_span"></span>我要投稿</a>
        </div>
    </ul>
</nav><!--导航结束-->

<div class="box">
    <h3>注册账号   <span class="right">还没有账号 快来注册</span></h3>

    <div class="menu_3">
        <div  id="user_name">
            <p><span>用 户 名：</span> <input type="text" name="login_name" value="" class="text_1" placeholder="用户名/邮箱"   autocomplete="off" required>
                <br/><span  class="none"> <em>*</em><i>请输入用户名</i></span>
            </p>
            <p><span> &nbsp;新 密 码：</span> <input type="text" name="pwd"  class="text_3"   autocomplete="off">
                <br/><span  class="none">  <em>*</em><i>密码6---9个字符，下划线英文数字组合</i></span>
            </p>
            <p><span>确认密码：</span> <input type="text" name="pwd2"  class="text_3"   autocomplete="off">
                <br/><span  class="none">  <em>*</em><i>两次密码不一致</i></span>
            </p>
            <p>
                <span>姓名：<input type="text" name="uname" class="text_1" autocomplete="off"></span>
            </p>
            <p>
                <span>电话：<input type="text" name="phone" class="text_1" autocomplete="off"></span>
            </p>
                <input type="submit" id="btn"  value="提交保存"  class="submit">
        </div>
    </div>
</div>
<footer class="clear">
    <p>书犹药也，善读之可以医愚。<a href="javascript:;">留言</a></p>
    <p>凡是任何售后问题请自己解决</p>
</footer>

<script>
    $("#btn").click(function() {
        // 获取表单信息
        let login_name = $("input[name='login_name']").val();
        let pwd = $("input[name='pwd']").val();
        let pwd2 = $("input[name='pwd2']").val();
        let uname = $("input[name='uname']").val();
        let phone = $("input[name='phone']").val();

        //校验表单完整性
        if (!login_name.trim()) {
            alert("用户名不能为空")
            return;
        }
        if (!pwd.trim()) {
            alert("新密码不能为空")
            return;
        }
        if (!pwd2.trim()) {
            alert("确认密码不能为空")
            return;
        }

        if (pwd.length < 6) {
            alert("密码最低不能少于6位")
            return;
        }
        if (pwd != pwd2) {
            alert("两次密码不同")
            return;
        }

        if (!uname.trim()) {
            alert("姓名不能为空")
            return;
        }
        if (!phone.trim()) {
            alert("电话不能为空")
            return;
        }
        $.ajax({
            url: "/user/addUser",
            type: "post",
            data: {
                "loginName": login_name,
                "pwd": pwd,
                "uname": uname,
                "phone": phone
            },
            success: function (res) {
                if (!res.status) {
                    alert(res.msg);
                } else {
                    alert(res.msg);
                    location.href="/user/toLogin";
                }
            },
            error: function () {

            }
        })

    })



</script>
</body>
</html>
